
{extend name='public/base' /}

{block name="content"}
<style type="text/css">
 html {
	    background-color: #fff !important;
	}
    table {
        border-collapse: collapse;
        text-align: center;
        min-width: 600px;
    }

    table td {
        border: 0.5px solid #f1f0f0;
        color: #000000;
        height: 30px;
        font-size: 13px;
        width: 30px;
    }

    table th {
        border: 0.5px solid #f1f0f0;
        color: #000000;
        height: 30px;
        font-weight: 600;
        font-size: 15px;
    }


    table thead th {
        width: 100px;
    }
    .tianjia{
        color: #ffffff;
        font-size: 14px;
        background-color: #2d8cf0;
        padding: 3px;
        width: 80px;
        border-radius: 5px;
        text-align: center;
        line-height: 24px;
        display: inline-block;
        float: right;
    }
</style>
<div class="layui-col-md12">
    <div class="layui-card">
        <div class="layui-card-body">
        <!--    {if condition="$info.pay_status == 0"}
            <div style="margin: 15px 0 0 0;text-align: right;">
                <button type="button" style="width: 120px;height: 30px; border-radius: 10px;color:#4580ff;background: none;border: 1px solid #4580ff;" lay-filter="charge" lay-submit="">收费</button>
            </div>
            {/if} -->
            <div  style=" width:800px;">
                <div style="font-weight: 600;font-size: 18px;line-height: 50px;">基本信息</div>
                <div style="display: flex;justify-content:space-between;">
                    <span style=" width: 500px;line-height: 35px;font-size: 14px;">缴费单号：{$info.order_sn}</span>
                    <span style=" width: 500px;line-height: 35px;font-size: 14px;">状态：{$info.pay_status_name}</span>
                    <span style=" width: 500px;line-height: 35px;font-size: 14px;">创建时间：{$info.time}</span>
                </div>
                <div style="display: flex;justify-content:space-between;">
                    <span style=" width: 500px;line-height: 35px;font-size: 14px;">创建人：{$info.add_user}</span>
                    <span style=" width: 500px;line-height: 35px;font-size: 14px;">备注：{$info.remark}</span>
                </div>
                <div style="display: flex;justify-content:space-between;">
                    <span style=" width: 500px;line-height: 35px;font-size: 14px;">审核时间：{$info.pay_time}</span>
                </div>
            </div>
            <div style="width: 600px;">
                <div style="font-weight: 600;font-size: 18px;line-height: 50px;">商户信息</div>
                <div style="display: flex;justify-content:space-between;width: 396px;">
                    <span style="line-height: 35px;font-size: 14px;">商户名：{$info.merchants.name}</span>
                    <span style="line-height: 35px;font-size: 14px;">商户编号：{$info.merchants.merchant_sn}</span>
                </div>
            </div>
            <div style="width: 600px;">
                <div style="font-weight: 600;font-size: 18px;line-height: 50px;">费用信息</div>
                <div style="display: flex;justify-content:space-between;width: 402px;">
                    <span style="line-height: 35px;font-size: 14px;">缴费项目：{$info.costType.cost_name}</span>
                    <span style="line-height: 35px;font-size: 14px;">缴费总金额：{$info.real_amount/100}</span>
                </div>
            </div>
<!--            <div style="width:600px;text-align: left; border: 1px solid #ccc;">-->
<!--                <div style="display: flex;justify-content:space-between;background-color: #dfdfdf;">-->
<!--                    <span style=" width: 200px;border-bottom: 1px solid #ccc; border-right: 1px solid #ccc;line-height: 35px;font-size: 15px;font-weight: 600;">科目编码</span>-->
<!--                    <span  style=" width: 200px;border-bottom: 1px solid #ccc; border-right: 1px solid #ccc;line-height: 35px;font-size: 15px;font-weight: 600;">项目名称</span>-->
<!--                    <span  style=" width: 200px;border-bottom: 1px solid #ccc;line-height: 35px;font-size: 15px;font-weight: 600;">金额（元）</span>-->
<!--                </div>-->
<!--                {volist name="info.costRule" id="t"}-->
<!--                <div style="display: flex;">-->
<!--                    <span  style=" width: 200px;border-bottom: 1px solid #ccc; border-right: 1px solid #ccc;line-height: 35px;font-size: 13px;">{$t.cost_sn}</span>-->
<!--                    <span  style=" width: 200px;border-bottom: 1px solid #ccc; border-right: 1px solid #ccc;line-height: 35px;font-size: 13px;">{$t.name}</span>-->
<!--                    <span  style=" width: 200px;border-bottom: 1px solid #ccc; line-height: 35px;font-size: 13px;">{$t.z_money}</span>-->
<!--                </div>-->
<!--                {/volist}-->
<!--            </div>-->
            <div style="width: 800px;display: flex;justify-content:space-between;font-size: 14px;">
                <span style="line-height: 35px;font-size: 14px;">缴费时间：{$info.pay_time}</span>
                <span style="line-height: 35px;font-size: 14px;">支付方式：{$info.subject_id}</span>
                <span style="line-height: 35px;font-size: 14px;">缴费方式：{$info.is_user}</span>
                <span style="line-height: 35px;font-size: 14px;">缴费人：{$info.fees_user}</span>
            </div>


            <div style="width: 600px;line-height: 50px;font-weight: 600; margin: 16px 0 4px 0;">缴费项目信息
                {if $info->pay_status==1}
                <div class="tianjia" lay-filter="refund" lay-submit="">退费</div>
                {/if}
            </div>

            <table  class="table">
                <thead>
                <tr style=" background-color: #f7f7f7;">
                    <th>项目名称</th>
                    <th>收费类型</th>
                    <th>金额</th>
					<!-- <th>退费情况</th> -->
                </tr>
                </thead>
                {volist name="info.costRule" id="t"}
                <tr>
                    <td>{$t.cost_sn}</td>
                    <td>{$t.type}</td>
                    <td >{$t.z_money}</td>
				<!-- {if $info->pay_status==1} -->
				  <!-- <td>未退费</td>	 -->
				 <!-- {/if} -->
				 <!-- {if $info->pay_status!=1} -->
				  <!-- <td style="color: #f00;">已退费</td> -->
				<!-- {/if} -->
                </tr>
                {/volist}
                </tr>
            </table>


            {if condition="$info.other_certificate"}
            <div>
                <div style="font-weight: 600;font-size: 18px;line-height: 50px;">其他信息</div>
                <div style="line-height: 35px;font-size: 15px; display: flex;margin: 0 0 0 15px;">凭证：
                    <!-- 放个链接 -->
                    <img id="show_id" style="width: 260px;margin: 10px 0 10px 0px;height: 150px" src="{$info.other_certificate}" alt="上传附件" width="120" height="120">
                </div>

            </div>
            {/if}
        </div>
    </div>
</div>
{/block}

{block name="js"} <!--js处理区-->




<script>
    layui.use(['element', 'table', 'form', 'jquery', 'lucky','opTable'], function () {
        var element = layui.element;
        var form = layui.form;
        var table = layui.table;
        var $ = layui.jquery;
        var lucky=layui.lucky;
        var opTable = layui.opTable;
        form.render();

        form.on('submit(charge)', function (obj) {
            var _id  = "{$info.id}"
            lucky.CreateOpenForm("审核提交","{:url('common/costEdit')}?id=" + _id);
            return false;
        });
        /**
         * 关键词搜索树
         */
        form.on('submit(search)', function (obj) {
            lucky.CreateSearch(obj.field);
            return false;
        });

        form.on('submit(refund)', function (obj) {
            var id  = "{$id}"
        lucky.CreateOpenForm("退费","{:url('rebate')}?id=" + id,'85%');
                        return false;
          

        });
    });

</script >

{/block}
